// axios基础封装  这个文件里面都写完之后 去api文件里 进项函数封装 
// 先引入axios 
import axios from "axios";

// 响应拦截器里的弹窗提示
// element-plus里面的
import { ElMessage } from 'element-plus'
import 'element-plus/theme-chalk/el-message.css'

// 请求拦截器要先引入store里的方法 
import { useUserStore } from "@/stores/user";

// 创建axios实例 
const httpInstance = axios.create ({
  // 接口基地址的封装
  baseURL:'http://pcapi-xiaotuxian-front-devtest.itheima.net',
  // 接口请求时间
  timeout:5000,
})

// axios请求拦截器
httpInstance.interceptors.request.use(config => {
  // 1.从pinia获取token数据
  const userStore = useUserStore()
  // 2.按照后端要求拼接token数据  `Bearer ${token}` 这个``里面的内容是根据后端的要求拼接的
  const token = userStore.userInfo.token
  if(token){
    config.headers.Authorization = `Bearer ${token}`
  }
  return config
}, e => Promise.reject(e))


// axios响应式拦截器
httpInstance.interceptors.response.use(res => res.data, e => {
  // 登录错误，统一提示错误 先引入ElMessage
  ElMessage({
    type:'warning',
    message:e.response.data.message
  })

  return Promise.reject(e)
})

// 要把axios实例抛出
export default httpInstance